<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('加油记录列表')" />
    <th:block th:include="include :: select2-css" />
</head>
<body class="gray-bg">
     <div class="container-div">
        <div class="row">
            

            <div class="col-sm-12 select-table table-striped">
               <div class="ibox float-e-margins" >
					<div class="ibox-title">
						<h5>统计分析</h5>
					</div>
					<div class="ibox-content">
						<div class="echarts" style="height: 600px" id="echarts-bar-chart0"></div> 
					</div>
				</div>
            </div>
        </div>
    </div>
    <th:block th:include="include :: footer" />
    <th:block th:include="include :: echarts-js" />
    <th:block th:include="include :: select2-js" />
    <script th:inline="javascript">
    var names0 = [[${res}]] 
    var res = []
    for(var k in  names0){
    	if(names0[k] != 0){
    		res.push({
        		name:k,
        		value:names0[k]
        	})
    	}
    	
    }
    $(function () {
    	var pipeChart0 = echarts.init(document.getElementById("echarts-bar-chart0")); 
    	var option = {
    		    title: {
    		        text: '选项比例', 
    		        left: 'center'
    		    },
    		    tooltip: {
    		        trigger: 'item'
    		    },
    		    legend: {
    		        orient: 'vertical',
    		        left: 'left',
    		    },
    		    series: [
    		        {
    		            name: '选项',
    		            type: 'pie',
    		            radius: '50%',
    		            data:res,
    		            emphasis: {
    		                itemStyle: {
    		                    shadowBlur: 10,
    		                    shadowOffsetX: 0,
    		                    shadowColor: 'rgba(0, 0, 0, 0.5)'
    		                }
    		            }
    		        }
    		    ]
    		};
    	pipeChart0.setOption(option);
         window.onresize = pipeChart0.resize;
         
    	
 	     
    }) 

    </script>
</body>
</html>